<template>
  <dialog-edit :visible.sync="modalVisible" title="工时" ref="userManageEdit" width="600"
               :height="formData.Id ? '450' : '360'" @save="save" :saveLoading="saveLoading" :destroyOnClose="true">
    <el-form slot="body" :rules="rules" ref="addFormCheck" :model="formData">
      <el-row :gutter="20" class="elrow">
        <el-col :span="12" v-if="modelType === 3">
          <el-form-item label="实际工时" prop="Tasktime">
            <el-input class="input" type="text" v-model="formData.STasktime">
              <template slot="append">小时</template>
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="modelType === 2 ? 24 : 12">
          <el-form-item label="预计工时" prop="Tasktime">
            <el-input class="input" type="text" v-model="formData.Tasktime">
              <template slot="append">小时</template>
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24" v-if="modelType === 4">
          <el-form-item label="认定工时" prop="Tasktime">
            <el-input class="input" type="text" v-model="formData.RTasktime">
              <template slot="append">小时</template>
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="预计开始时间" prop="Started">
            <el-date-picker
                value-format= 'timestamp'
                class="data-form"
                v-model="formData.Started"
                type="datetime"
                placeholder="选择日期">
            </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="预计结束时间" prop="Ended">
            <el-date-picker
                value-format= 'timestamp'
                class="data-form"
                v-model="formData.Ended"
                type="datetime"
                placeholder="选择日期">
            </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="说明">
            <el-input v-model="formData.Comment"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </dialog-edit>
</template>

<script>
import dialogEdit from '@/components/element/dialogEdit'
import projectTaskWorkApi from "@/api/projectTaskWorkApi";
import * as format from "@/filters";
import projectTaskApi from "@/api/projectTaskApi";
export default {
  name: "workingHours",
  components: {
    dialogEdit
  },
  props: {
    modelType: {
      type: Number,
      default: () => {
        return 0
      }
    },
    visible: {
      type: Boolean,
      default: () => {
        return false
      }
    },
    formData: {
      type: Object,
      default: () => {
        return {}
      }
    }
  },
  computed: {
    modalVisible: {
      get () {
        return this.visible
      },
      set (val) {
        this.$emit('update:visible', val)
      }
    }
  },
  data () {
    return {
      saveLoading: false,
      rules: {
        Tasktime: { required: true, message: '使用工时必填', trigger: 'change' },
        Started: { required: true, message: '开始时间必填', trigger: 'change' },
        Ended: { required: true, message: '结束时间必填', trigger: 'change' },
      }
    }
  },
  methods: {
    save () {
      this.$refs.addFormCheck.validate((v) => {
        if (v) {
          this.saveLoading = true
          if (this.modelType === 2) {
            this.formData.id = this.formData.Id
            projectTaskApi.update(this.formData).then(res => {
              this.$XModal.message({message: res.message, status: res.code === 1 ? 'success' : 'error'})
              if (res.code === 1) {
                this.modalVisible = false
                this.$emit('close')
              }
            }).finally(() => {
              this.saveLoading = false
            })
          } else if (this.modelType === 3) {
            this.addTime()
          }
          // }
        } else {
          this.$message({ type:'warning', message: '提交数据不足，请填写' })
          return false;
        }
      })
    },
    // 新增工时
    addTime () {
      this.saveLoading = true
      let a = {
        Taskid: this.formData.Id,
        Userid: this.$store.state.user.id,
        Tasktime: (this.formData.STasktime || '0').toString(),
        Surplustasktime: (this.formData.Tasktime || '0').toString(),
        Started: (this.formData.Started || '').toString(),
        Ended: (this.formData.Ended || '').toString()
      }
      if (this.formData.Id) {
        a.Type = 1
        a.Started = a.Started.toString()
        a.Ended = a.Ended.toString()
      }
      projectTaskWorkApi.create([a]).then(res => {
        if (res.hasOwnProperty('code')) {
          if (res.code === 1) {
            this.modalVisible = false
            this.$emit('close')
          }
          this.$message({type: res.code===1 ? 'success':'warning', message: res.message})
        }
      }).finally(() => {
        this.saveLoading = false
      })
    },
    // 认定工时
    rendingTime () {

    }
  },
  watch: {
    modalVisible: {
      handler (n, o) {
        console.log(this.formData)
        if (this.modelType !== 2) {
          if (this.formData.Tasktimes) {
            let STasktime = this.formData.Tasktimes.reduce((a, it) => {
              let b = Number(it.Tasktime)
              if (isNaN(b)) b = 0
              a += b
              return a
            }, 0)
            this.formData.Tasktime = Number(this.formData.Tasktime) - STasktime
          } else {
            this.formData.Tasktime = 0
          }
        }
        if (!this.formData.Ended) {
          let ended = format.formatDatetime(new Date(), 'yyyy-MM-dd') + ' 18:00'
          this.$set(this.formData, 'Ended', new Date(ended).valueOf())
        }
        if (!this.formData.Started) {
          let started = format.formatDatetime(new Date(), 'yyyy-MM-dd') + ' 09:00'
          this.$set(this.formData, 'Started', new Date(started).valueOf())
        }
      }
    }
  }
}
</script>

<style scoped>
.elrow {
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.data-form {
  width: 100%;
}
</style>